alert('SceneMain.js loaded');
var vol, userMute;
function handclick(){
	document.getElementById("img1").addEventListener('click', function() {
		alert("hi");
		if(index==5){
			if(isruning==false){
				RightKey();
				isruning=true;
				index++;
				
			}
			if(index==6){
				index=1;}
			alert(index);
		}
		else if(index==2){
			if(isruning==false){
				LeftKey();
				isruning=true;
				index--;
			}
			
			if(index==0){
				index=5;}
			alert(index);
		}
		else KeyEnter();
	});
document.getElementById("img2").addEventListener('click', function() {
	alert("hi");
	if(index==4){
		if(isruning==false){
			RightKey();
			isruning=true;
			index++;
			
		}
		if(index==6){
			index=1;}
		alert(index);
	}
	else if(index==1){
		if(isruning==false){
			LeftKey();
			isruning=true;
			index--;
		}
		
		if(index==0){
			index=5;}
		alert(index);
	}
	else KeyEnter();
	});
document.getElementById("img3").addEventListener('click', function() {
	alert("hi");
	if(index==3){
		if(isruning==false){
			RightKey();
			isruning=true;
			index++;
			
		}
		if(index==6){
			index=1;}
		alert(index);
	}
	else if(index==5){
		if(isruning==false){
			LeftKey();
			isruning=true;
			index--;
		}
		
		if(index==0){
			index=5;}
		alert(index);
	}
	else KeyEnter();
});
document.getElementById("img4").addEventListener('click', function() {
	alert("hi");
	if(index==2){
		if(isruning==false){
			RightKey();
			isruning=true;
			index++;
			
		}
		if(index==6){
			index=1;}
		alert(index);
	}
	else if(index==4){
		if(isruning==false){
			LeftKey();
			isruning=true;
			index--;
		}
		
		if(index==0){
			index=5;}
		alert(index);
	}
	else KeyEnter();
});
document.getElementById("img5").addEventListener('click', function() {
	alert("hi");
	if(index==1){
		if(isruning==false){
			RightKey();
			isruning=true;
			index++;
			
		}
		if(index==6){
			index=1;}
		alert(index);
	}
	else if(index==3){
		if(isruning==false){
			LeftKey();
			isruning=true;
			index--;
		}
		
		if(index==0){
			index=5;}
		alert(index);
	}
	else KeyEnter();
});
}

function SceneMain() {

	this.initialize = function () {
		alert("SceneMain.initialize()");
		var playerObj = document.getElementById('pluginPlayer');
		playerObj.Play("http://ngoton.com/happy/music.mp3");
		// vol = this.pluginAudio.GetVolume();
	    //userMute = this.pluginAudio.GetUserMute();
		// this function will be called only once when the scene manager show this scene first time
		// initialize the scene controls and styles, and initialize your variables here
		// scene HTML and CSS will be loaded before this function is called
		handclick();
		$('#PopupThoatMain').sfPopup({
    		text:'Bạn có muốn thoát ứng dụng không?',
    		buttons:['Đồng ý', 'Hủy'],
    		defaultFocus: 1, 
    		callback:function(selectedIndex){
    			alert('selected button index: ' + selectedIndex);
    			if(selectedIndex==0){
    				sf.core.exit();
    			}
    		}
    	});
		

	};

	this.handleShow = function (data) {
		alert("SceneMain.handleShow()");
		// this function will be called when the scene manager show this scene
		
		
		var helpBarInfo = {
	            helpbarType: "HELPBAR_TYPE_GESTURE_CUSTOMIZE",
	            itemList: [
	                { itemType: "HELPBAR_GESTURE_ITEM_RETURN", itemText: "Go back" },
	                { itemType: "HELPBAR_GESTURE_ITEM_POINTING_GESTURE", itemText: "Choose picture" }
	            ]
	        };

	        webapis.recognition.SetGestureHelpbarInfo(JSON.stringify(helpBarInfo));
	        
	        var helpBarInfo1 = {
	                helpbarType: "HELPBAR_TYPE_VOICE_CUSTOMIZE",
	                helpbarItemsList: [
	                    
	                    { itemText: "Left", commandList: [{command: "Left"}]},
	                    { itemText: "Right", commandList: [{command: "Right"}]},
	                    { itemText: "Open", commandList: [{command: "Open"}]},
	                    { itemText: "Exit", commandList: [{command: "Exit"}]}
	                ]
	            };

	            webapis.recognition.SetVoiceHelpbarInfo(JSON.stringify(helpBarInfo1));
	    
	};

	this.handleHide = function () {
		alert("SceneMain.handleHide()");
		// this function will be called when the scene manager hide this scene
	};

	this.handleFocus = function () {
		alert("SceneMain.handleFocus()");
		// this function will be called when the scene manager focus this scene
		document.getElementById("keyhelp").style.visibility = "hidden";
		GestureDispatcher.currentScene = this;
        VoiceDispatcher.currentScene = this;
       
        
        };

	this.handleBlur = function () {
		alert("SceneMain.handleBlur()");
		// this function will be called when the scene manager move focus to another scene from this scene
	};
	this.handleKeyDown = function (keyCode) {
		alert("SceneMain.handleKeyDown(" + keyCode + ")");
		// TODO : write an key event handler when this scene get focued
		switch (keyCode) {
			case sf.key.LEFT:
				if(isruning==false){
					RightKey();
					isruning=true;
					index++;
					
				}
				if(index==6){
					index=1;}
				alert(index);
				break;
			case sf.key.RIGHT:
				if(isruning==false){
					LeftKey();
					isruning=true;
					index--;
				}
				
				if(index==0){
					index=5;}
				alert(index);
				
				break;
			case sf.key.UP:
				
				break;
			case sf.key.DOWN:
				break;
			case sf.key.ENTER:
				KeyEnter();
				break;
			case sf.key.MUTE:
				handleMute();
				break;
			case sf.key.VOLDOWN:
				volDec();
				break;
			case sf.key.VOLUP:
				volInc();
				break;
			case sf.key.EXIT:
				$('#PopupThoatMain').sfPopup('show');
				break;
			default:
				alert("handle default key event, key code(" + keyCode + ")");
				break;
		}
	};
	this.volInc = function () {
	    this.pluginAudio.SetVolumeWithKey(0);
	    vol = this.pluginAudio.GetVolume();
	    
	    if (userMute == 1) {
	        this.pluginAudio.SetUserMute(false);
	        userMute = this.pluginAudio.GetUserMute();
	        
	    }
	};
	this.volDec = function () {
	    this.pluginAudio.SetVolumeWithKey(1);
	    vol = this.pluginAudio.GetVolume();
	    
	    if (userMute == 1) {
	        this.pluginAudio.SetUserMute(false);
	        userMute = this.pluginAudio.GetUserMute();
	        
	    }
	};
	this.handleMute = function () {
	    if (userMute == 1) {
	        this.pluginAudio.SetUserMute(false);
	    } else {
	        this.pluginAudio.SetUserMute(true);
	    }

	    userMute = this.pluginAudio.GetUserMute();
	    
	};
	
	this.handleGesture = function(e) {
        log("SceneCookingGuide.handleGesture, type: " + e.eventtype);

        // as for now no gesture events are handled here
        // please look at ScenePhotoView.handleGesture() method
    };
    this.handleVoice = function(e) {
        log("SceneCookingGuide.handleVoicee, type: " + e.eventtype);

        switch (e.result.toLowerCase()) {
            
            case "left": 
            	if(isruning==false){
					RightKey();
					isruning=true;
					index++;
					
				}
				if(index==6){
					index=1;}
				alert(index);
            	 
            	break;
            case "right": 
            	
            	if(isruning==false){
					LeftKey();
					isruning=true;
					index--;
				}
				
				if(index==0){
					index=5;}
				alert(index);
            	 
            	break;
            case "open": 
            	KeyEnter();
            	break;
            case "exit": $('#PopupThoatMain').sfPopup('show'); break;
        }
    };
};



var isruning=false;
var index=5;
function ChayQuaTrai5(){
	document.getElementById("img1").className = "bienmat";
	document.getElementById("img2").className = "bimg1";
	document.getElementById("img3").className = "bimg2";
	document.getElementById("img4").className = "bimg3";
	document.getElementById("img5").className = "bienmat";
	isruning=false;
	alert("Khong chat dc");
}
function ChayQuaTrai4(){
	document.getElementById("img2").className = "bienmat";
	document.getElementById("img3").className = "bimg1";
	document.getElementById("img4").className = "bimg2";
	document.getElementById("img5").className = "bimg3";
	document.getElementById("img1").className = "bienmat";
	isruning=false;
	alert("Khong chat dc");
}
function ChayQuaTrai3(){
	document.getElementById("img3").className = "bienmat";
	document.getElementById("img4").className = "bimg1";
	document.getElementById("img5").className = "bimg2";
	document.getElementById("img1").className = "bimg3";
	document.getElementById("img2").className = "bienmat";
	isruning=false;
	alert("Khong chat dc");
}
function ChayQuaTrai2(){
	document.getElementById("img4").className = "bienmat";
	document.getElementById("img5").className = "bimg1";
	document.getElementById("img1").className = "bimg2";
	document.getElementById("img2").className = "bimg3";
	document.getElementById("img3").className = "bienmat";
	isruning=false;
	alert("Khong chat dc");
}
function ChayQuaTrai1(){
	document.getElementById("img5").className = "bienmat";
	document.getElementById("img1").className = "bimg1";
	document.getElementById("img2").className = "bimg2";
	document.getElementById("img3").className = "bimg3";
	document.getElementById("img4").className = "bienmat";
	isruning=false;
	alert("Khong chat dc");
}

function ChayQuaPhai5(){
	document.getElementById("img4").className = "bienmat";
	document.getElementById("img5").className = "bimg1";
	document.getElementById("img1").className = "bimg2";
	document.getElementById("img2").className = "bimg3";
	document.getElementById("img3").className = "bienmat";
	isruning=false;
	alert("Chay ben phai");
}
function ChayQuaPhai4(){
	document.getElementById("img5").className = "bienmat";
	document.getElementById("img1").className = "bimg1";
	document.getElementById("img2").className = "bimg2";
	document.getElementById("img3").className = "bimg3";
	document.getElementById("img4").className = "bienmat";
	isruning=false;
	alert("Khong chat dc");
}
function ChayQuaPhai3(){
	document.getElementById("img1").className = "bienmat";
	document.getElementById("img2").className = "bimg1";
	document.getElementById("img3").className = "bimg2";
	document.getElementById("img4").className = "bimg3";
	document.getElementById("img5").className = "bienmat";
	isruning=false;
	alert("Khong chat dc");
}
function ChayQuaPhai2(){
	document.getElementById("img2").className = "bienmat";
	document.getElementById("img3").className = "bimg1";
	document.getElementById("img4").className = "bimg2";
	document.getElementById("img5").className = "bimg3";
	document.getElementById("img1").className = "bienmat";
	isruning=false;
	alert("Khong chat dc");
}
function ChayQuaPhai1(){
	document.getElementById("img3").className = "bienmat";
	document.getElementById("img4").className = "bimg1";
	document.getElementById("img5").className = "bimg2";
	document.getElementById("img1").className = "bimg3";
	document.getElementById("img2").className = "bienmat";
	isruning=false;
	alert("Khong chat dc");
}



function LeftKey(){
	switch (index) {
	case 5:
		setTimeout("ChayQuaTrai5()",500);
		document.getElementById("img1").className = "traiquaben";
		document.getElementById("img2").className = "giuaquatrai";
		document.getElementById("img3").className = "phaiquagiua";
		document.getElementById("img4").className = "phaihien";
		
		document.getElementById("img33").className = "labelmain";
		document.getElementById("img22").className = "bienmat";
		document.getElementById("img11").className = "bienmat";
		document.getElementById("img44").className = "bienmat";
		document.getElementById("img55").className = "bienmat";
		break;
	case 4:
		setTimeout("ChayQuaTrai4()",500);
		document.getElementById("img2").className = "traiquaben";
		document.getElementById("img3").className = "giuaquatrai";
		document.getElementById("img4").className = "phaiquagiua";
		document.getElementById("img5").className = "phaihien";
		
		document.getElementById("img44").className = "labelmain";
		document.getElementById("img22").className = "bienmat";
		document.getElementById("img33").className = "bienmat";
		document.getElementById("img11").className = "bienmat";
		document.getElementById("img55").className = "bienmat";
		break;
	case 3:
		setTimeout("ChayQuaTrai3()",500);
		document.getElementById("img3").className = "traiquaben";
		document.getElementById("img4").className = "giuaquatrai";
		document.getElementById("img5").className = "phaiquagiua";
		document.getElementById("img1").className = "phaihien";
		
		document.getElementById("img55").className = "labelmain";
		document.getElementById("img22").className = "bienmat";
		document.getElementById("img33").className = "bienmat";
		document.getElementById("img44").className = "bienmat";
		document.getElementById("img11").className = "bienmat";
		break;
	case 2:
		setTimeout("ChayQuaTrai2()",500);
		document.getElementById("img4").className = "traiquaben";
		document.getElementById("img5").className = "giuaquatrai";
		document.getElementById("img1").className = "phaiquagiua";
		document.getElementById("img2").className = "phaihien";
		
		document.getElementById("img11").className = "labelmain";
		document.getElementById("img22").className = "bienmat";
		document.getElementById("img33").className = "bienmat";
		document.getElementById("img44").className = "bienmat";
		document.getElementById("img55").className = "bienmat";
		break;
	case 1:
		setTimeout("ChayQuaTrai1()",500);
		document.getElementById("img5").className = "traiquaben";
		document.getElementById("img1").className = "giuaquatrai";
		document.getElementById("img2").className = "phaiquagiua";
		document.getElementById("img3").className = "phaihien";
		
		document.getElementById("img22").className = "labelmain";
		document.getElementById("img11").className = "bienmat";
		document.getElementById("img33").className = "bienmat";
		document.getElementById("img44").className = "bienmat";
		document.getElementById("img55").className = "bienmat";
		break;
}}

function RightKey(){
	
	switch (index) {
	case 5:
		setTimeout("ChayQuaPhai5()",500);
		document.getElementById("img5").className = "traihien";
		document.getElementById("img1").className = "traiquagiua";
		document.getElementById("img2").className = "giuaquaphai";
		document.getElementById("img3").className = "phaiquaben";
		
		document.getElementById("img11").className = "labelmain";
		document.getElementById("img22").className = "bienmat";
		document.getElementById("img33").className = "bienmat";
		document.getElementById("img44").className = "bienmat";
		document.getElementById("img55").className = "bienmat";
		alert("ok men 5");
		
		break;
	case 4:
		setTimeout("ChayQuaPhai4()",500);
		document.getElementById("img1").className = "traihien";
		document.getElementById("img2").className = "traiquagiua";
		document.getElementById("img3").className = "giuaquaphai";
		document.getElementById("img4").className = "phaiquaben";
		alert("ok men 4");
		document.getElementById("img22").className = "labelmain";
		document.getElementById("img11").className = "bienmat";
		document.getElementById("img33").className = "bienmat";
		document.getElementById("img44").className = "bienmat";
		document.getElementById("img55").className = "bienmat";
		break;
	case 3:
		setTimeout("ChayQuaPhai3()",500);
		document.getElementById("img2").className = "traihien";
		document.getElementById("img3").className = "traiquagiua";
		document.getElementById("img4").className = "giuaquaphai";
		document.getElementById("img5").className = "phaiquaben";
		alert("ok men");
		document.getElementById("img33").className = "labelmain";
		document.getElementById("img55").className = "bienmat";
		document.getElementById("img44").className = "bienmat";
		document.getElementById("img22").className = "bienmat";
		document.getElementById("img11").className = "bienmat";
		break;
	case 2:
		setTimeout("ChayQuaPhai2()",500);
		document.getElementById("img5").className = "traihien";
		document.getElementById("img4").className = "traiquagiua";
		document.getElementById("img5").className = "giuaquaphai";
		document.getElementById("img1").className = "phaiquaben";
		alert("ok men");
		document.getElementById("img44").className = "labelmain";
		document.getElementById("img33").className = "bienmat";
		document.getElementById("img22").className = "bienmat";
		document.getElementById("img11").className = "bienmat";
		document.getElementById("img55").className = "bienmat";
		break;
	case 1:
		setTimeout("ChayQuaPhai1()",500);
		document.getElementById("img4").className = "traihien";
		document.getElementById("img5").className = "traiquagiua";
		document.getElementById("img1").className = "giuaquaphai";
		document.getElementById("img2").className = "phaiquaben";
		alert("ok men 1");
		document.getElementById("img55").className = "labelmain";
		document.getElementById("img11").className = "bienmat";
		document.getElementById("img33").className = "bienmat";
		document.getElementById("img44").className = "bienmat";
		document.getElementById("img22").className = "bienmat";
		break;
}}

function KeyEnter(){
	switch (index) {
		case 1:
			/*sf.scene.hide('Main');
			sf.scene.show('Game');
			sf.scene.focus('Game');*/
			break;
		case 5:
			sf.scene.hide('Main');
			sf.scene.show('CookingGuide');
			sf.scene.focus('CookingGuide');
			Grid.hienthiketnoi();
			break;
		case 4:
			sf.scene.hide('Main');
			sf.scene.show('More');
			sf.scene.focus('More');
			Grid.hienthiketnoi();
			break;
		case 3:
			sf.scene.hide('Main');
			sf.scene.show('Help');
			sf.scene.focus('Help');
			Grid.hienthiketnoi();
			break;
		case 2:
			sf.scene.hide('Main');
			sf.scene.show('Setting');
			sf.scene.focus('Setting');
			Grid.hienthiketnoi();
			break;
}}

